<?php /*

Template Name: 说说

author: 秋叶

url: http://www.wuover.com/141.html

*/

get_header(); ?>
<style type="text/css">
.shuoshuo {
position: relative;
padding: 10px 0;
}
.shuoshuo li {
padding: 8px 0;
display: block;
}
.shuoshuo-content {
box-shadow: 0 0 3px RGBA(0,0,0,.15);
background-color: #f2f2f2;
border:1px #ccc solid;
border-radius: 4px;
font-size: 1.2em;
line-height:1.5em;
margin:0 150px 0 200px;
letter-spacing: 1px;
padding: 20px 20px 5px 30px;
color: #666;
min-height:60px;
position: relative;
	white-space: pre; /* CSS 2.0 */ 
	white-space: pre-wrap; /* CSS 2.1 */ 
	white-space: pre-line; /* CSS 3.0 */ 
	white-space: -pre-wrap; /* Opera 4-6 */ 
	white-space: -o-pre-wrap; /* Opera 7 */ 
	white-space: -moz-pre-wrap; /* Mozilla */ 
	white-space: -hp-pre-wrap; /* HP Printers */ 
	word-wrap: break-word; /* IE 5+, 文本行的任意字内断开 */
}
.shuoshuo-content p{margin:0;}
/*作者*/
.shuoshuo-meta {
text-align: right;
letter-spacing: 0px;
margin-top:-10px;
}
/*时间*/
.shuoshuo .tt{margin: 35px 0 0 15px;float:left;font-size:0.7em;}
.shuoshuo li em{float:left;background:url('images/ss.png') no-repeat;width:50px;height:10px;margin:42px 0 0 28px;}
.shuoshuo li:hover .tt {color:#0c0;font-weight:bold;}
/*头像*/
.shuoshuo .zhutou{border-radius: 50%;margin: 25px 35px 0 5px;float:right;padding: 2px;border: 1px #ddd solid;display: block;transition: .5s;width: 40px;height: 40px;overflow:hidden;}
.shuoshuo li:hover .zhutou {
transform: rotate(720deg);-webkit-transform: rotate(720deg);-moz-transform: rotate(720deg);border-color: #0c0;}
/*前面的轴*/
.shuoshuo:before {
height: 100%;
width: 2px;
background: #eee;
position: absolute;
left: 164px;
content: "";
top:0px;
}
.shuoshuo-content:before {
position: absolute;
top: 40px;
bottom: 0px;
left: -42px;
background: #fff;
height: 12px;
width: 12px;
border-radius: 6px;
content: "";
box-shadow: inset 0 0 2px #0c0;
}
.shuoshuo-content:after {
position: absolute;
top: 42px;
bottom: 0px;
left: -40px;
background: #ccc;
height: 8px;
width: 8px;
border-radius: 6px;
content: "";
}
.shuoshuo li:hover .shuoshuo-content:after {
background: #0c0;
-webkit-transform: scale(1.3);
-moz-transform: scale(1.3);
-ms-transform: scale(1.3);
-o-transform: scale(1.3);
}
.shuoshuo li:hover .shuoshuo-content:before {-webkit-transform: scale(1.3);
-moz-transform: scale(1.3);
-ms-transform: scale(1.3);
-o-transform: scale(1.3);}
/*后面的轴*/
.shuoshuo:after {
height: 100%;
width: 2px;
background: #eee;
position: absolute;
right: 100px;
content: "";
top:0px;
}
.shuoshuo-meta:before {
position: absolute;
top: 42px;
bottom: 0px;
right: -56px;
background: #fff;
height: 12px;
width: 12px;
border-radius: 6px;
content: "";
z-index:2;
box-shadow: inset 0 0 2px #0c0;
}
.shuoshuo-meta:after {
position: absolute;
top: 44px;
bottom: 0px;
right: -54px;
background: #ccc;
height: 8px;
width: 8px;
z-index:2;
border-radius: 6px;
content: "";
}
.shuoshuo li:hover .shuoshuo-meta:after {
background: #0c0;
}
@media screen and (max-width: 800px) { 
.shuoshuo-content {margin:0 60px 0 70px;padding: 10px 10px 5px 10px;font-size:0.9em;}
.shuoshuo .tt{width:30px;font-weight:bold;margin: 30px 0 0 1px;font-size:0.5em;height: 20px;}
.shuoshuo li:hover .tt {color:#0c0;font-size:0.5em;}
.shuoshuo:before {left: 50px;}
.shuoshuo-content:before {left: -26px;top:30px;}
.shuoshuo-content:after {left: -24px;top:32px;}

.shuoshuo:after {right: 27px;}
.shuoshuo-meta:before {right: -39px;top:33px;}
.shuoshuo-meta:after {right: -37px;top:35px;}

.shuoshuo .zhutou{margin: 17px 5px 0 5px;}
.shuoshuo li em{float:left;width:39px;height:10px;margin:34px 0 0 -1px;}
}
</style>
<div class="shuoshuo">

 <ul class="archives-monthlisting">

 <?php query_posts("post_type=shuoshuo&post_status=publish&posts_per_page=-1");if (have_posts()) : while (have_posts()) : the_post(); ?>

 <li><img src="<?php bloginfo( 'template_url' ); ?>/images/myblog.gif" class="zhutou" alt="作者头像"/><span class="tt"><?php the_time('Y年n月j日G:H'); ?></span>

 <div class="shuoshuo-content"><?php the_content(); ?><br/><div class="shuoshuo-meta"><span >—<?php the_author() ?></span></div></div><?php endwhile;endif; ?>
 </li>

 </ul>

</div>
<?php //ist_pagenavi();?>
<?php get_footer();?>